window.onload = function () {
    document.getElementById("message").onclick = function () {
        var a = document.querySelectorAll('dl>dd')
        for(i=0;i<4;i++){
            a[i].classList.toggle("hide")
        }
    }
    document.getElementById("superSail").onclick = function () {
        var a = document.querySelectorAll('dl>dd')
        for(i=4;i<6;i++){
            a[i].classList.toggle("hide")
        }
    }
    document.getElementById("order").onclick = function () {
        var a = document.querySelectorAll('dl>dd')
        for(i=6;i<a.length;i++){
            a[i].classList.toggle("hide")
        }
    }
    console.log("12313135");
    function searchAddress(){
        axios.get('/home/address/address/queryAddress',{
            params:{
            }
        }).then(function(data){
            console.log(data.data.data);
            if(data.data.data.code==20000){
                var list = data.data.data.data
                if(list.length == 0){
                    document.getElementById("formbox").innerHTML = ``
                    document.getElementById("formbox").innerHTML += `
                    <div class="nothing" onclick="add()">这里什么也没有哦，赶紧点击添加吧</div>
                    `
                }else{
                    document.getElementById("myMessage").innerHTML = ``
                    let i=0;
                    for(let key in list){
                        // 字符串拼接渲染用户数据
                        document.getElementById("myMessage").innerHTML += `
                        <div class="formbox">
                            <div class="addressForm">
                                <div class="addresseemes">
                                    <div class="addressee">${list[key].addressee}</div>
                                    <div class="addresseeTele">${list[key].addresseeTele}</div>
                                </div>
                                <div class="myaddress">${list[key].address}</div>
                                <div class="do">
                                    <input type="checkbox" class="doset" onchange="checkThis(${i})">设为默认地址
                                    <button class="doDelete" onclick="deletethis(${list[key].addressId})">删除</button>
                                    <button class="doChange" onclick="changeit('${list[key].addressee}','${list[key].addresseeTele}','${list[key].address}','${list[key].addressId}')">修改</button>
                                </div>
                            </div>
                        </div>
                        `
                    }
                    document.getElementById("myMessage").innerHTML += `
                    <button type="submit" class="btn" onclick="add()">新增</button>
                    <span class="btn delet">批量删除</span>
                    `
                }
            }else{
                document.getElementById("floatContent").innerHTML ="<div>"+ "很抱歉"+"</div>"+"<div>"+"地址检索失败，请联系工作人员"+"</div>"+"<button onclick='closethis()' class='newbtn'>"+"确定"+"</button>";
                document.getElementById("floatContent").classList.remove("hide");
            }
        }).catch(function (error){
            console.log(error)
            
            document.getElementById("floatContent").innerHTML ="<div>"+ "很抱歉"+"</div>"+"<div>"+"请检查网络情况"+"</div>"+"<button onclick='closethis()' class='newbtn'>"+"确定"+"</button>";
            document.getElementById("floatContent").classList.remove("hide");
        })
    }
    (function(){searchAddress()})();
}
function add(){
    document.getElementById("myMessage").innerHTML = ``
    document.getElementById("myMessage").innerHTML = `
    <div class="addressTop">新增收货地址<div class="returnAddress"><a href="./address">返回</a></div></div>
        <div class="form-group">
          <label for="name">收货人&nbsp;:&nbsp;</label>
          <input type="text" class="form-control name" name="addressee" id="addressee" onkeyup="value=value.replace(/[^\u4e00-\u9fa5]/g,'')" placeholder="收货人姓名">
        </div>
        <div class="form-group">
            <label for="tel">手机号&nbsp;:&nbsp;</label>
            <input type="text" class="form-control tel" name="addresseeTele" id="addresseeTele" onkeyup="this.value=this.value.replace(/[^\d{0-9}]/g,'')" maxlength=11 placeholder="移动电话">
        </div>
        <div class="form-group">
            <label for="address">地址&nbsp;&nbsp;&nbsp;&nbsp;:&nbsp;</label>
            <input type="text" class="form-control" name="address" id="address" placeholder="详细地址">
        </div>
        <div class="setting formBottom">
            <input type="checkbox" class="doset" id="doset">设为默认地址
        </div>
        <button type="submit" class="btn" onclick="addAddress()">提交</button>
        <span class="btn reset" onclick="newthis()">重置</span>
    </div>
    `
}

function searchAddress(){
    axios.get('/home/address/address/queryAddress',{
        params:{
        }
    }).then(function(data){
        if(data.data.data.code==20000){
            var list = data.data.data.data
            if(list.length == 0){
                document.getElementById("myMessage").innerHTML = `
                    <div class="formbox" id="formbox"></div>
                `
                document.getElementById("formbox").innerHTML = ``
                document.getElementById("formbox").innerHTML += `
                <div class="nothing" onclick="add()">这里什么也没有哦，赶紧点击添加吧</div>
                `
            }else{
                document.getElementById("myMessage").innerHTML = ``
                for(let i = 0; i < list.length; i++){
                    // 字符串拼接渲染用户数据
                    document.getElementById("myMessage").innerHTML += `
                    <div class="formbox">
                        <div class="addressForm">
                            <div class="addresseemes">
                                <div class="addressee">${list[i].addressee}</div>
                                <div class="addresseeTele">${list[i].addresseeTele}</div>
                            </div>
                            <div class="myaddress">${list[i].address}</div>
                            <div class="do">
                                <input type="checkbox" class="doset" onchange="checkThis(${i})">设为默认地址
                                <button class="doDelete" onclick="deletethis(${list[i].addressId})">删除</button>
                                <button class="doChange" onclick="changeit('${list[i].addressee}','${list[i].addresseeTele}','${list[i].address}','${list[i].addressId}')">修改</button>
                            </div>
                        </div>
                    </div>
                    `
                }
                document.getElementById("myMessage").innerHTML += `
                <button type="submit" class="btn" onclick="add()">新增</button>
                <span class="btn delet">批量删除</span>
                `
            }
        }else{
            document.getElementById("floatContent").innerHTML ="<div>"+ "很抱歉"+"</div>"+"<div>"+"地址检索失败，请联系工作人员"+"</div>"+"<button onclick='closethis()' class='newbtn'>"+"确定"+"</button>";
            document.getElementById("floatContent").classList.remove("hide");
        }
    }).catch(function (error){
        console.log(error)
        document.getElementById("floatContent").innerHTML ="<div>"+ "很抱歉"+"</div>"+"<div>"+"请检查网络情况"+"</div>"+"<button onclick='closethis()' class='newbtn'>"+"确定"+"</button>";
        document.getElementById("floatContent").classList.remove("hide");
    })
}

function checkThis(a){
    var dosets = document.getElementsByClassName("doset")
    for(i = 0; i<dosets.length;i++){
        dosets[i].checked = ``
    }
    dosets[a].checked = `checked`
}

function addAddress(){
    var address = document.getElementById("address").value
    var addressee = document.getElementById("addressee").value
    var addresseeTele = document.getElementById("addresseeTele").value
    var setting = 0
    if(document.getElementById("doset").checked){
        setting = 1
    }
    if(address==``){
        document.getElementById("floatContent").innerHTML = `<div>地址不能为空</div><button onclick='closethis()' class='newbtn'>确定</button>`;
        document.getElementById("floatContent").classList.remove("hide");
    }else if(addressee == ``){
        document.getElementById("floatContent").innerHTML = `<div>收货人不能为空</div><button onclick='closethis()' class='newbtn'>确定</button>`;
        document.getElementById("floatContent").classList.remove("hide");
    }else if(addresseeTele == ``){
        document.getElementById("floatContent").innerHTML = `<div>联系方式不能为空</div><button onclick='closethis()' class='newbtn'>确定</button>`;
        document.getElementById("floatContent").classList.remove("hide");
    }else{
        axios.post('/home/address/address/addAddress',{
            params:{
                address:address,
                addressee:addressee,
                addresseeTele:addresseeTele,
                setting:0,
            }
        }).then(function(data){
            if(data.data.data.code==20000){
                document.getElementById("floatContent").innerHTML ="<div>"+"添加地址成功"+"</div>"+"<button onclick='closethis();searchAddress()' class='newbtn'>"+"确定"+"</button>";
                document.getElementById("floatContent").classList.remove("hide");
            }else{
                document.getElementById("floatContent").innerHTML =`<div>很抱歉</div><div>${data.data.data.data}</div><button onclick='closethis()' class='newbtn'>确定</button>`;
                document.getElementById("floatContent").classList.remove("hide");
            }
        }).catch(function (error){
            console.log(error)
            document.getElementById("floatContent").innerHTML =`<div>很抱歉</div><div>请检查网络是否连接</div><button onclick='closethis()' class='newbtn'>确定</button>`;
            document.getElementById("floatContent").classList.remove("hide");
        })
    }
}

function deletethis(addressId){
    axios.get('/home/address/address/deleteAddress',{
        params:{
            addressId:addressId
        }
    }).then(function(data){
        if(data.data.data.code==20000){
            document.getElementById("floatContent").innerHTML =`<div>删除地址成功</div><button onclick='closethis();searchAddress()' class='newbtn'>确定</button>`;
            document.getElementById("floatContent").classList.remove("hide");
        }else{
            document.getElementById("floatContent").innerHTML =`<div>很抱歉</div><div>${data.data.data.data}</div><button onclick='closethis()' class='newbtn'>确定</button>`;
            document.getElementById("floatContent").classList.remove("hide");
        }
    }).catch(function (error){
        document.getElementById("floatContent").innerHTML =`<div>很抱歉</div><div>请检查网络是否连接</div><button onclick='closethis()' class='newbtn'>确定</button>`;
        document.getElementById("floatContent").classList.remove("hide");
        console.log(error)
    })
}


function changeit(addressee,addresseeTele,address,addressId){
    document.getElementById("changeAddressee").value = addressee;
    document.getElementById("changeAddresseeTele").value = addresseeTele;
    document.getElementById("changeAddress").value = address;
    document.getElementById("changeContent").classList.remove("hide");
    // document.getElementById("changeThis").addEventListener("click",function(){
    document.getElementById("changeThis").onclick = function(){
        var address = document.getElementById("changeAddress").value
        var addressee = document.getElementById("changeAddressee").value
        var addresseeTele = document.getElementById("changeAddresseeTele").value
        document.getElementById("changeContent").classList.add("hide");
            axios.put('/home/address/address/updateAddress',{
                params:{
                    addressId:addressId,
                    address:address,
                    addressee:addressee,
                    addresseeTele:addresseeTele,
                    setting:0,
                }
            }).then(function(data){
                if(data.data.data.code==20000){
                    console.log(addressId)
                    document.getElementById("floatContent").innerHTML =`<div>修改成功</div><button onclick='closethis();searchAddress()' class='newbtn'>确定</button>`;
                    document.getElementById("floatContent").classList.remove("hide");
                }else{
                    document.getElementById("floatContent").innerHTML =`<div>很抱歉</div><div>${data.data.data.data}</div><button onclick='closethis()' class='newbtn'>确定</button>`;
                    document.getElementById("floatContent").classList.remove("hide");
                }
            }).catch(function (error){
                console.log(error)
                document.getElementById("floatContent").innerHTML =`<div>很抱歉</div><div>更改地址失败</div><button onclick='closethis()' class='newbtn'>确定</button>`;
                document.getElementById("floatContent").classList.remove("hide");
            })
    // })
        }
}

function newthis(){
    document.getElementById("address").value = ``
    document.getElementById("addressee").value = ``
    document.getElementById("addresseeTele").value = ``
}

function giveup(){
    document.getElementById("changeContent").classList.add("hide");
}
function closethis(){
    document.getElementById("floatContent").classList.add("hide");
}